<template>
  <div>
    <MyList :request-url-obj="requestUrlObj">
    </MyList>
  </div>
</template>

<script setup>
import MyList from "../inspiration/MyList.vue";
import {onMounted, ref, watch} from "vue";
import {useRouter, useRoute, onBeforeRouteUpdate} from 'vue-router'
import axios from "../../axios/axios.js";
import {ElMessage} from "element-plus";

const router = useRouter()
const route = useRoute()

const requestUrlObj = ref({})


let query = route.query.query
const changePage = (query)=>{
  //console.log(query);
  axios.get("/url/"+ query).then(res => {
    requestUrlObj.value = res.data.data;
  }).catch(error =>{
    ElMessage.error(error)
  })
}

//onMounted(()=>{
//  changePage(query);
//})

//onBeforeRouteUpdate((to, from)=>{
//  //console.log("1改变了");
//  //console.log(to.query.query);
//  changePage(to.query.query);
//})


watch(()=>route,(old,newValue)=>{
  //console.log("route变了");
  //console.log(route.query.query);
  changePage(route.query.query);
},{
  //非惰性
  immediate: true,
  //深度监视
  deep: true
})



</script>

<style scoped>
</style>
